跨域 解决跨域问题一般有两种思路: CORS 在后端服务器设置 HTTP 响应头,把你需要运行访问的域名加入加入 Access-Control-Allow-Origin中. jsonp 把后端根据请求,构造 json 数据,并返回,前端用 jsonp 跨域. 这两种思路,本文不展开讨论. 需要说明的是,nginx 根据第一种思路,也提供了一种解决跨域的解决方案. 环境 centos7 nginx:latest 如何配置 编写 enable-cors.conf 参考如下 # allow origi

重装nginx出现,重启出现错误 ./nginx -s reload nginx: [error] open() "/usr/local/nginx/logs/nginx.pid" failed (2: No such file or directory) 解决办法: /usr/local/nginx/sbin/nginx -c /usr/local/nginx/conf/nginx.conf 命令解释: -c filename : set configuration file (de

Django跨域问题(CORS错误) 一.出现跨域问题(cors错误)的原因 通常情况下,A网页访问B服务器资源时,不满足以下三个条件其一就是跨域访问 协议不同 端口不同 主机不同 二.Django解决跨域 1.安装django-cors-headers模块 pip3 install django-cors-headers 2.注册AAP INSTALLED_APPS = [ ... 'corsheaders' ] 3.添加中间件 MIDDLEWARE = [ ... 'corsheaders.

Thinkjs 作为奇舞团开源的nodejs mvc框架之一,引起了很多NodeJS程序员的亲赖.但是其关于静态文件处理部分支持不够完善,主要是体现在SPA单页应用,之前在ThinkJS 2.*版本时写过一个关于处理单页应用静态资源的middleware think-resource-spa,但是这个只是建议在开发调试环境中使用,并不是解决方案. 一般作为线上服务,都会使用Nginx作为静态服务资源代理,然后ThinkJS官网的nginx默认配置只是普通代理,所以在官方群里就经常有人闻到,前端用

前言 最近做的一个项目中使用了vue+springboot的前后端分离模式 在前端开发的的时候,使用vue cli3的devServer来解决跨域问题 上线部署则是用的nginx反向代理至后台服务所开的端口 正文 开发环境中的跨域 首先,要确定后台服务的ip与端口 这里我的后台开的是 localhost:8081 npm run serve在8080端口 一般我们使用ajax请求的时候,会可以把url ip:port/api 写在ajax请求的url参数中 this.axios.get("loc

1.在配置路由并引入组件后,报错: Unknown custom element: <router-link> - did you register the component correctly? For recursive components, make sure to provide the "name" option. 错误原因:vue-router没有注册 解决办法: //注册插件 *****************非常重要,不能忘记 Vue.use(VueRo

在生成vue项目的时候,出现如下错误 ERROR in static/js/index.d66d806fcdd72b36147b.js from UglifyJs Unexpected token: punc (() [src/components/Hello.vue:,][,] ERROR in static/js/cell.89bb6f1195b769a2c949.js from UglifyJs Unexpected token: punc (() [src/components/cell

这几天正自学Vue, 用eggjs + vue 采用前后分离,写一个网站练练手. 增加了一个商品详情页 Detail.vue的时候,点击进入Detail.vue的时候,页面显示空白,打开浏览器调试工具,出现了以下错误 进入了死循环. 仔细检查了页面.发现页面引用了一个组件,和页面的name 重复了. 所以进入页面的时候,一直都在死循环.

这个错误很常见,很明显找不到文件. 原因是php-fpm找不到SCRIPT_FILENAME里执行的php文件,所以返回给nginx 404 错误. 那么两种情况要么文件真的不存在,要么就是路径错误. location / { root /var/www/example.com; index index.html index.htm index.pl; } 如果配置文件这样的,那么明显不好,也就是在 location ~ \.php$ { fastcgi_pass 127.0.0.1:9000;

方案一: 当输入错误链接错误或者找不到页面,在router里可以定义一个404页面,具体可以这样做:在routes里面这样写: { path:'*', component:error, name:'error', meta:{ title:'页面没找到' } } 注意:一定要写在routes的最后面! 方案二 在入口js文件使用了axios的拦截器 import Vue from 'vue' import Vuex from 'vuex' import axios from 'axios' im

nginx是一个高性能的HTTP和反向代理服务器.因此常用来做静态资源服务器和后端的反向代理服务器.本文主要记录使用nginx去部署使用vue搭建的前端项目,项目基于vue官方的脚手架vue-cli构建. 打包vue项目 npm run build 通过上面命令后打包好的静态资源将输出到dist目录中.如图所示 如图所示 修改nginx配置文件,配置文件为conf下的nginx.conf,修改nginx.conf中的server配置片段 server { listen ;#默认端口是80,如果端

1.修改 router/index.js 添加一行 base: 'admin', 2.然后修改 config/index.js 增加一行 const assetsPublicPath = '/admin/' 然后修改 下面两处  assetsPublicPath 的值为定义的变量 3.部署时,通过NGINX的反向代理 首先,给需要部署的项目定义一个 NGINX 的 server server { listen ; location / { # vue h5 history mode 时配置 tr

在一个Vue的PC项目中,要求给错误图片不要让它显示丑陋的图片,就要给图片写一个失败后的默认图片, 在这里写了两种方法, 第一种方法,也就是百度到的最多的代码,就是给一张图片一个默认值. 第二种问题,如果页面中有很多地方都存在这个东西,那么在不同的页面中写很对是很麻烦的. 就使用到了VUe的指令. 这里分为了两种情况,一种是直接加载默认图片,等图片加载完成之后再使用加载完成的图片. 代码如下 // 如果自定义指令多的话,再重新开启一个文件专门写自定义指令 太乱了 //全局注册自定义指令,用于判断

https://enable-cors.org/server_nginx.html # # Wide-open CORS config for nginx # location / { if ($request_method = 'OPTIONS') { add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS'; # # Custom h

1.部署Nginx 请参考Linux下部署nginx,此处不再重复 2.Vue项目打包 # 打包正式环境 npm run build:prod # 打包预发布环境 npm run build:stage 3. 部署时可能会发现资源路径不对 ,只需修改 vue.config.js下 文件资源路径 # 请根据自己路径来配置更改 publicPath: './' 4. 将打包后的dist文件夹上传至服务器 本次项目路径为 /usr/local/webapp/ 5.修改Nginx的conf文件 vim

1.编译打包Vue项目 在终端输入 npm run build 进行打包编译.等待... 打包完成生成dist文件夹,这就是打包完成的文件. 我们先放着,进行下一步. 2下载Nginx 下载地址: http://nginx.org/en/download.html 下载完成解压就可以了.由于我这个腾讯云服务,只有一个C盘,我就放在C盘根目录下,放其他目录下也是一样的. 接下来把Nginx设置为windwos服务 每次重启,我们都需要手动的启动一下服务,对我们运维很不方便. 1.我们使用  win

https://www.cnblogs.com/jiangwangxiang/p/8481661.html nginx下载地址 http://nginx.org/en/download.html 下载nginx后 ,在目录下cmd   执行 nginx.exe 在进程中查看是否启动nginx.  关闭nginx   ,也要到进程中关闭.‘ 2.参考  打包本地的vue项目文件,在html目录下创建文件夹zic,然后把打包好的 dist 目录下的 static文件夹和index.html放入到zi

最近有时间研究了下前端项目如何在nginx服务器下进行部署,折腾了两天总算有所收获,汗~~ 所以就想着写篇文章来总结一下,主要包括以下三个方面: 1.打包好的vue项目如何进行部署. 2.如何反向代理后端服务接口. 3.vue项目二级访问目录在nginx下的配置. 说明:nginx服务器的安装及vue项目如何进行打包不在本文的讨论范围,后面的所有实践说明都是基于个人的本地服务,和项目真实的应用环境稍微有点差别(其实这点差别可以忽略). 一.如何部署vue项目. 假设我们打包好的项目地址为:d:\

1.errorHandler Vue全局配置 errorHandler可以进行全局错误收集,捕获全局错误抛出,避免前端页面挂掉   export default function errorHandler(vue) {     vue.config.errorHandler = function(err, vm, info) {         // handle error         // `info` 是 Vue 特定的错误信息,比如错误所在的生命周期钩子         // 只在 

1.vue配置 /** * * 相对于该配置的nginx服务器请参考nginx配置文件 * */ module.exports = { // 基本路径 publicPath: '/', // 输出文件目录 outputDir: 'dist', // webpack-dev-server 相关配置 devServer: { port: 5577, // 端口号 host: "localhost", // IP地址 open: false, // 配置自动启动浏览器 proxy: { '/

修改nginx配置文件为 server { listen 80; server_name www.vue.com; root html/xxx/dist/; client_max_body_size 500m; #图片路径拦截,定位到图片静态资源 location / { try_files $uri $uri/ @router; index index.html index.htm index.php; } location @router{ rewrite ^.*$ /index.html