当前位置: 首页 > news >正文

apache搭建静态网站,moongoose搭建网站后台,出现的跨域问题解决

文章目录

  • 1,问题描述
    • 1.1,当网页和后台是不同服务时会产生跨域问题
    • 1.2,跨域问题
  • 2,nginx端口转发解决跨域问题
    • 2.1,下载并安装nginx
      • 2.1.1,解压后如下所示
      • 2.1.2,进入解压目录后,执行配置脚本
    • 2.2,编译安装
    • 2.3,nginx使用
      • 2.3.1,设置nginx开机自启动
      • 2.3.2,修改配置文件配置端口转发
      • 2.3.3,启动nginx
      • 2.3.4,发现由于80端口被apache占用了,nginx无法启动
      • 2.3.5,直接关闭apache,使用nginx托管静态网站代码
  • 3,更新动态IP到nginx配置文件

1,问题描述

1.1,当网页和后台是不同服务时会产生跨域问题

Access to XMLHttpRequest at ‘http://ubuntu:9607/login’ from origin ‘http://www.anweimian.com’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
在这里插入图片描述

1.2,跨域问题

同源策略会导致跨域问题
所谓"同源"指的是"三个相同"。协议相同域名相同端口相同

http://www.example.com/dir2/other.html:同源
http://example.com/dir/other.html:不同源(域名不同)
http://v2.www.example.com/dir/other.html:不同源(域名不同)
http://www.example.com:81/dir/other.html:不同源(端口不同)

2,nginx端口转发解决跨域问题

2.1,下载并安装nginx

https://nginx.org/en/download.html
在这里插入图片描述

2.1.1,解压后如下所示

在这里插入图片描述

2.1.2,进入解压目录后,执行配置脚本

./configure
HTTP rewrite 模块需要 PCRE 库的支持

在这里插入图片描述

sudo apt-get install libpcre3-dev
安装好PCRE 库后再次执行 ./configure

在这里插入图片描述

2.2,编译安装

sudo make -j
sudo make install

2.3,nginx使用

2.3.1,设置nginx开机自启动

vim /etc/rc.local
文本底部追加
/usr/local/nginx/sbin/nginx

2.3.2,修改配置文件配置端口转发

 /usr/local/nginx/conf/nginx.conf

在这里插入图片描述

2.3.3,启动nginx

sudo /usr/local/nginx/sbin/nginx

2.3.4,发现由于80端口被apache占用了,nginx无法启动

在这里插入图片描述

2.3.5,直接关闭apache,使用nginx托管静态网站代码

sudo /etc/init.d/apache2 stop

在这里插入图片描述

#重启nginx
sudo /usr/local/nginx/sbin/nginx -s reload

3,更新动态IP到nginx配置文件

#!/usr/bin/bash
# 为 win 设置 wsl host
# win hosts 文件路径
# 获取 wsl2 的 ip
wsl_ip=$(ifconfig eth0 | grep -w inet | awk '{print $2}')CHANGE_HOST()
{HOST_NAME=$1HOST_IP=$2win_hosts_path="/mnt/c/Windows/System32/drivers/etc/hosts"# 判断是否已存在 wsl2 的域名,如果存在则修改,否则追加if grep -wq "$HOST_NAME" $win_hosts_paththen# 此处因为权限问题没有直接用 sed 修改 hosts 文件win_hosts=$(sed -s "s/.* $HOST_NAME/$HOST_IP $HOST_NAME/g" $win_hosts_path)echo "$win_hosts" > $win_hosts_pathelseecho "$HOST_IP $HOST_NAME" >> $win_hosts_pathfi
}CHANGE_NGINX_HOST_BY_PORT()
{SERVER_PORT=$1HOST_IP=$2nginx_config_path="/usr/local/nginx/conf/nginx.conf"# 判断是否已存在 wsl2 的域名,如果存在则修改,否则追加if grep -wq "proxy_pass\|$SERVER_PORT" $nginx_config_paththen# 此处因为权限问题没有直接用 sed 修改 hosts 文件nginx_conf=$(sed -s "s/.*proxy_pass.*http:\/\/.*:$SERVER_PORT;/         proxy_pass http:\/\/$HOST_IP:$SERVER_PORT/g" $nginx_config_path)echo "$nginx_conf" > $nginx_config_pathelseecho "$SERVER_PORT is not in $nginx_conf"fi
}CHANGE_HOST "www.anweimian.com" $wsl_ip
CHANGE_HOST "ubuntu" $wsl_ipCHANGE_NGINX_HOST_BY_PORT "9607" $wsl_ip

相关文章:

apache搭建静态网站,moongoose搭建网站后台,出现的跨域问题解决

文章目录 1,问题描述1.1,当网页和后台是不同服务时会产生跨域问题1.2,跨域问题 2,nginx端口转发解决跨域问题2.1,下载并安装nginx2.1.1,解压后如下所示2.1.2,进入解压目录后,执行配置…...

LiveQing视频点播流媒体RTMP推流服务功能-支持视频点播分屏大屏展示视频轮巡分组播放RMP推流直播大屏展示

LiveQing支持视频点播分屏大屏展示视频轮播分组播放RMP推流直播大屏展示 1、分屏展示2、轮巡播放3、RTMP推流视频直播和点播流媒体服务 1、分屏展示 LiveQing支持将视频点播、鉴权直播,拉转直播视频流,进行分屏播放。 2、轮巡播放 3、RTMP推流视频直播和…...

tf loss构建常用到函数

1、tf.map_fn tf.map_fn是TensorFlow中的一个函数,用于对给定的函数和输入进行逐元素的映射,其定义如下: tf.map_fn(fn,elems,dtypeNone,parallel_iterationsNone,back_propTrue,swap_memoryFalse,infer_shapeTrue,nameNone,fn_output_sign…...

行为型模式-备忘录模式

备忘录模式保存一个对象的某个状态,以便在适当的时候恢复对象。备忘录模式属于行为型模式。 意图:在不破坏封装性的前提下,捕获一个对象的内部状态,并在该对象之外保存这个状态。 主要解决:所谓备忘录模式就是在不破坏…...

Android Studio初学者实例:RecyclerView学习--模仿今日头条--续

新学期开始了,这篇文章收到了很多人的评论有很多地方不懂,所以写下了以下的文章--续篇 首先使用RecyclerView也好还是使用ListView,更或是GridView你都要先构思需要什么 这些东西无一例外通常都是用在列表显示下,那么需要一些&a…...

栈和队列的C++模拟实现

一、栈stack 1.介绍(库里面的文档介绍) 1. stack是一种容器适配器,专门用在具有后进先出操作的上下文环境中,其删除只能从容器的一端进行元素的插入与提取操作。 2. stack是作为容器适配器被实现的,容器适配器即是对…...

UE4/5:通过Blender制作BlendShape导入【UE4/5曲线、变形目标,blender形态键】

UE4/5里面,我们经常可以在一些骨骼模型上面看到相关的曲线,如Metahuman里面就是通过这个曲线来改变人物的脸部表情。 而这里笔者将教导如何去制作这种曲线。 这种曲线都是存在于骨骼模型上的,所以我们要么直接制作骨骼模型导入ue&#xff0…...

微信小程序进阶——后台交互

目录 一、后台准备 1.1 pom.xml 1.2 配置数据源 1.3 整合mybatis 二、前后端交互 2.1 method1 2.2 method2 2.2.1 封装request 2.2.2 头部引用util 2.2.3 编写方法 2.2.4 展示效果 三、WXS的使用 3.1 会议状态 3.1.2 引入wxs 3.1.3 修改代码 3.1.4 展示效果 3…...

二维码智慧门牌管理系统升级解决方案:突破传统,实现质检与抽检的个性化配置

文章目录 前言一、引入“独立质检”二、个性化抽检类别设定三、触发重采要素的功能升级四、升级优势与展望 前言 在数字化时代,智慧门牌管理系统已经成为社会管理的重要工具。为了满足各种复杂需求,系统升级是必然趋势。本次升级主要针对质检和抽检两大…...

《动手学深度学习 Pytorch版》 9.4 双向循环神经网络

之前的序列学习中假设的目标是在给定观测的情况下对下一个输出进行建模,然而也存在需要后文预测前文的情况。 9.4.1 隐马尔可夫模型中的动态规划 数学推导太复杂了,略。 9.4.2 双向模型 双向循环神经网络(bidirectional RNNs)…...

【Axure高保真原型】可视化图表图标

今天和粉丝们免费分享可视化图表图标原型模板,包括柱状图、条形图、环形图、散点图、水波图等常用的可视化图表图标。 【原型效果】 【原型预览】 https://axhub.im/ax9/d402c647c82f9185/#c1 【原型下载】 这个模板可以在 Axure高保真原型哦 小程序里免费下载哦…...

安装mmcv及GPU版本的pytorch及torchvision

一、先装GPU版本的pytorch和torchvision pip install torch1.9.1cu111 torchvision0.10.1cu111 torchaudio0.9.1 -f https://download.pytorch.org/whl/torch_stable.html注意:以上适用cuda11.1版本 如果想离线安装,就看这篇文章 二、安装mmcv 看这篇…...

全国342个城市往返最短通勤时间(铁路)数据

全国342个城市往返最短通勤时间(铁路)数据 1、时间:采集时间是2022年 2、来源:12306 3、数据说明:数据采集12306数据,整理全国342个城市往返最短通勤时间,本数据是铁路包含动车、高铁所有路线…...

AWK语言第二版 第3章.探索性数据分析 3.1泰坦尼克号的沉没

这章也是第一版没有,第二版新增的。 3. 探索性数据分析 上一章给出了一些个人使用的小脚本,通常是特制或专用的。在本章中,我们还会展示Awk在现实中的典型使用场景:使用Awk和其他工具来非正式地探索一些真实的数据,目…...

微信小程序设计之主体文件app-json-window

一、新建一个项目 首先,下载微信小程序开发工具,具体下载方式可以参考文章《微信小程序开发者工具下载》。 然后,注册小程序账号,具体注册方法,可以参考文章《微信小程序个人账号申请和配置详细教程》。 在得到了测…...

WebDAV之π-Disk派盘 + 密码键盘

密码键盘是一款密码管理器,可以存储和管理需要受保护的数据。为方便日常使用,同时也是一款安全输入法,帮您安全便捷地填写账号密码、通用内容、卡包信息。 密码键盘使用军事级的 PBKDF2 有损加密算法保护您的根密码,使用军事级的 AES 加密算法保护您的存储数据。云端再额外…...

LeetCode讲解篇之77. 组合

文章目录 题目描述题解思路题解代码 题目描述 题解思路 遍历nums,让当前数字添加到结果前缀中,递归调用,直到前缀的长度为k,然后将前缀添加到结果集 题解代码 func combine(n int, k int) [][]int {var nums make([]int, n)fo…...

【openwrt学习笔记】Dying Gasp功能和pstore功能的配置(高通 ipq95xx)

目录 一、Dying Gasp信号1.1 概念1.2 实现原理 二、pstore 功能2.1 概念2.2 实现原理 三、openwrt中开启pstore功能3.1 软硬件参数3.2 各文件修改3.2.1 defconfig3.2.2 dts(ipq9574-default-memory.dtsi)3.2.3 fs/pstore/ram.c 四、测试4.1 挂载4.2 触发命令和效果 参考资料&am…...

使用RestSharp和C#编写程序

以下是一个使用RestSharp和C#编写的爬虫程序,用于爬取www.zhihu.com上的视频。此程序使用了https://www.duoip.cn/get_proxy来获取代理IP。 using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks…...

Leetcode 2911. Minimum Changes to Make K Semi-palindromes

Leetcode 2911. Minimum Changes to Make K Semi-palindromes 1. 解题思路2. 代码实现 题目链接:2911. Minimum Changes to Make K Semi-palindromes 1. 解题思路 这一题属实也是把我坑惨了…… 坦率地说,这道题本身并没有啥难度,但是坑爹…...

Cursor实现用excel数据填充word模版的方法

cursor主页:https://www.cursor.com/ 任务目标:把excel格式的数据里的单元格,按照某一个固定模版填充到word中 文章目录 注意事项逐步生成程序1. 确定格式2. 调试程序 注意事项 直接给一个excel文件和最终呈现的word文件的示例,…...

(十)学生端搭建

本次旨在将之前的已完成的部分功能进行拼装到学生端,同时完善学生端的构建。本次工作主要包括: 1.学生端整体界面布局 2.模拟考场与部分个人画像流程的串联 3.整体学生端逻辑 一、学生端 在主界面可以选择自己的用户角色 选择学生则进入学生登录界面…...

盘古信息PCB行业解决方案:以全域场景重构,激活智造新未来

一、破局:PCB行业的时代之问 在数字经济蓬勃发展的浪潮中,PCB(印制电路板)作为 “电子产品之母”,其重要性愈发凸显。随着 5G、人工智能等新兴技术的加速渗透,PCB行业面临着前所未有的挑战与机遇。产品迭代…...

React Native 开发环境搭建(全平台详解)

React Native 开发环境搭建(全平台详解) 在开始使用 React Native 开发移动应用之前,正确设置开发环境是至关重要的一步。本文将为你提供一份全面的指南,涵盖 macOS 和 Windows 平台的配置步骤,如何在 Android 和 iOS…...

在HarmonyOS ArkTS ArkUI-X 5.0及以上版本中,手势开发全攻略:

在 HarmonyOS 应用开发中,手势交互是连接用户与设备的核心纽带。ArkTS 框架提供了丰富的手势处理能力,既支持点击、长按、拖拽等基础单一手势的精细控制,也能通过多种绑定策略解决父子组件的手势竞争问题。本文将结合官方开发文档&#xff0c…...

关于nvm与node.js

1 安装nvm 安装过程中手动修改 nvm的安装路径, 以及修改 通过nvm安装node后正在使用的node的存放目录【这句话可能难以理解,但接着往下看你就了然了】 2 修改nvm中settings.txt文件配置 nvm安装成功后,通常在该文件中会出现以下配置&…...

1.3 VSCode安装与环境配置

进入网址Visual Studio Code - Code Editing. Redefined下载.deb文件,然后打开终端,进入下载文件夹,键入命令 sudo dpkg -i code_1.100.3-1748872405_amd64.deb 在终端键入命令code即启动vscode 需要安装插件列表 1.Chinese简化 2.ros …...

用机器学习破解新能源领域的“弃风”难题

音乐发烧友深有体会,玩音乐的本质就是玩电网。火电声音偏暖,水电偏冷,风电偏空旷。至于太阳能发的电,则略显朦胧和单薄。 不知你是否有感觉,近两年家里的音响声音越来越冷,听起来越来越单薄? —…...

Git常用命令完全指南:从入门到精通

Git常用命令完全指南:从入门到精通 一、基础配置命令 1. 用户信息配置 # 设置全局用户名 git config --global user.name "你的名字"# 设置全局邮箱 git config --global user.email "你的邮箱example.com"# 查看所有配置 git config --list…...

淘宝扭蛋机小程序系统开发:打造互动性强的购物平台

淘宝扭蛋机小程序系统的开发,旨在打造一个互动性强的购物平台,让用户在购物的同时,能够享受到更多的乐趣和惊喜。 淘宝扭蛋机小程序系统拥有丰富的互动功能。用户可以通过虚拟摇杆操作扭蛋机,实现旋转、抽拉等动作,增…...