精华内容
下载资源
问答
  • #访问路径拼接img访问本地绝对路径下的某图片 location /img/ { #跨域配置,如果不生效请先清除浏览器缓存数据 add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Credentials'...
        #访问路径拼接img访问本地绝对路径下的某图片 
        location /img/ {
            #跨域配置,如果不生效请先清除浏览器缓存数据
            add_header 'Access-Control-Allow-Origin' '*';
            add_header 'Access-Control-Allow-Credentials' 'true';
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
            add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
            expires      30d;
            #当访问https://server_name/img/路径时,就会访问本的/Users/chokshen/Desktop/img/文件夹
            root /Users/chokshen/Desktop/;
            error_log off;
            access_log /dev/null;
            autoindex on;
        }

     

    展开全文
  • 分析: 前端是vue做的页面,需要去请求另一台机器上的资源和数据,这里是请求一张图片,结果报错显示不出来,这里涉及到了跨域请求静态资源,需要在10.90这台机器上配置nginx。 解决方法: 在静态资源的请求路由下...

    现象:

    Access to image at 'http://192.168.10.90:7000/media/ig/person/photo/20200714/4ed4724efcf9414eb8b8d74e0580985d.jpg' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

    分析:

    前端是vue做的页面,需要去请求另一台机器上的资源和数据,这里是请求一张图片,结果报错显示不出来,这里涉及到了跨域请求静态资源,需要在10.90这台机器上配置nginx。

    解决方法:

    在静态资源的请求路由下增加配置如下:

    location /media {
            alias   /data/xxx/media/;
            add_header 'Access-Control-Allow-Origin' '*'; 
        }

    配置完成后,重启nginx服务,问题得到解决!

    展开全文
  • nginx设置图片跨域访问

    千次阅读 2020-03-09 17:47:21
    生而为人 谁不付出 谁不努力 #user nobody; worker_processes 1; #error_log logs/error.log; #error_log logs/error.log notice; #error_log logs/error.log info;...#pid logs/nginx.pid; events { ...

    生而为人 谁不付出 谁不努力

     

    
    #user  nobody;
    worker_processes  1;
    
    #error_log  logs/error.log;
    #error_log  logs/error.log  notice;
    #error_log  logs/error.log  info;
    
    #pid        logs/nginx.pid;
    
    
    events {
        worker_connections  1024;
    }
    
    
    http {
        include       mime.types;
        default_type  application/octet-stream;
    
        #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
        #                  '$status $body_bytes_sent "$http_referer" '
        #                  '"$http_user_agent" "$http_x_forwarded_for"';
    
        #access_log  logs/access.log  main;
    
        sendfile        on;
        #tcp_nopush     on;
    
        #keepalive_timeout  0;
        keepalive_timeout  65;
        client_max_body_size 50m;
    
        #gzip  on;
    
        server {
            listen       80;
            server_name  localhost;
    
            #charset koi8-r;
    
            #access_log  logs/host.access.log  main;
    
            location / {
                root   html;
                index  index.html index.htm;
            }
    
            #error_page  404              /404.html;
    
            # redirect server error pages to the static page /50x.html
            #
            error_page   500 502 503 504  /50x.html;
            location = /50x.html {
                root   html;
            }
    
            # proxy the PHP scripts to Apache listening on 127.0.0.1:80
            #
            #location ~ \.php$ {
            #    proxy_pass   http://127.0.0.1;
            #}
    
            # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
            #
            #location ~ \.php$ {
            #    root           html;
            #    fastcgi_pass   127.0.0.1:9000;
            #    fastcgi_index  index.php;
            #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
            #    include        fastcgi_params;
            #}
    
            # deny access to .htaccess files, if Apache's document root
            # concurs with nginx's one
            #
            #location ~ /\.ht {
            #    deny  all;
            #}
        }
    
    
        # another virtual host using mix of IP-, name-, and port-based configuration
        #
        #server {
        #    listen       8000;
        #    listen       somename:8080;
        #    server_name  somename  alias  another.alias;
    
        #    location / {
        #        root   html;
        #        index  index.html index.htm;
        #    }
        #}
    
    
        # HTTPS server
        #
        #server {
        #    listen       443 ssl;
        #    server_name  localhost;
    
        #    ssl_certificate      cert.pem;
        #    ssl_certificate_key  cert.key;
    
        #    ssl_session_cache    shared:SSL:1m;
        #    ssl_session_timeout  5m;
    
        #    ssl_ciphers  HIGH:!aNULL:!MD5;
        #    ssl_prefer_server_ciphers  on;
    
        #    location / {
        #        root   html;
        #        index  index.html index.htm;
        #    }
        #}
        server {
            listen       80;
            server_name  m.xinjuenet.cn;
            location / {
            	proxy_pass              http://m.xinjuenet.cn:8080;
            	proxy_set_header        X-Real-IP       $remote_addr;
            	proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
    
            }
            }
    	server {
    	listen       80;
    	server_name  manager.xinjuenet.cn;
    	location / {
    		proxy_pass              http://manager.xinjuenet.cn:8080;
    		proxy_set_header        X-Real-IP       $remote_addr;
    		proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
    
    	}
    	location /video/ {
    					alias               /var/www/Uploads/xinjue/;
    					autoindex on;
    
    				}
    	}
    	server {
    	listen       80;
    	server_name  report.xinjuenet.cn;
    	location / {
    		proxy_pass              http://report.xinjuenet.cn:8080;
    		proxy_set_header        X-Real-IP       $remote_addr;
    		proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
    
    	}
    	}
    	server {
    	listen       80;
    	server_name  appsrv.xinshuidashi.cn;
    	location / {
    		proxy_pass              http://appsrv.xinshuidashi.cn:8080;
    		proxy_set_header        X-Real-IP       $remote_addr;
    		proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
    
    	}
    	}
    	server {
    	listen       80;
    	server_name  manager.xinshuidashi.cn;
    	location / {
    		proxy_pass              http://manager.xinshuidashi.cn:8080;
    		proxy_set_header        X-Real-IP       $remote_addr;
    		proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
    		
    	}
    	}
    	server {
    	listen       80;
    	server_name  images.xinjuenet.cn;
    	location / {
    		root              /var/www/Uploads/xinjue;
    		add_header Access-Control-Allow-Origin *;
    		add_header Access-Control-Allow-Headers X-Requested-With;
    		add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
    
    		
    
    	}
    	}
    server {
    	listen       80;
    	server_name  images.xinshuidashi.cn;
    	location / {
    		root              /var/www/Uploads;
    		
    
    	}
    	}
    }
    

    标注的红色区域就是解决图片跨域访问如下

    add_header Access-Control-Allow-Origin *;
    add_header Access-Control-Allow-Headers X-Requested-With;
    add_header Access-Control-Allow-Methods GET,POST,OPTIONS; 

    <video id="img" data="0" crossorigin="anonymous">  crossorigin="anonymous" 添加这个属性可以解决跨域访问视频

     

    展开全文
  • } 重点是添加 标注的红色区域就是解决图片跨域访问如下 add_header Access-Control-Allow-Origin *; add_header Access-Control-Allow-Headers X-Requested-With; add_header Access-Control-Allow-Methods GET,...

      server {
        listen 80;
        server_name static.xx.com;
        location ~* \.(html|htm|shtml|zip|rar|doc|docx|xls|xlsx|ppt|ppts|gif|jpg|jpeg|png|bmp|swf|ico|js|css)$ {
                     root /data/htdocs/xx;   
                      add_header Access-Control-Allow-Origin *;
                     add_header Access-Control-Allow-Headers X-Requested-With;
                      add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
           } 

     

    重点是添加

    标注的红色区域就是解决图片跨域访问如下

    add_header Access-Control-Allow-Origin *;
    add_header Access-Control-Allow-Headers X-Requested-With;
    add_header Access-Control-Allow-Methods GET,POST,OPTIONS; 

    展开全文
  • 1. 跨域(反向代理)(正向代理隐藏真实客户端,反向代理隐藏真实服务端)『反向代理:客户端无法感知代理,因为客户端访问网络不需要配置,只要把请求发送到反向代理服务器,由反向代理服务器去选择目标服务器获取...
  • Nginx是一款轻量级的Web 服务器/反向代理服务器及电子邮件其特点是占有内存少,并发能力强。 官网地址: https://nginx.org/en/download.html 当一台tomcat无法承受客户端的压力时,对tomcat服务器搭建集群. Nginx让...
  • 下面是对public/img下的图片做的跨域处理 nginx配置 location ~ /img { add_header Content-Type 'text/html; charset=utf-8'; add_header Access-Control-Allow-Origin *; return 200 '{"msg":"/api/"...
  • nginx的upstream目前支持4种方式的分配 1、轮询(默认) 每个请求按时间顺序逐一分配到不同的后端服务器,如果后端服务器down掉,能自动剔除。 2、weight 指定轮询几率,weight和访问比率成正比,用于后端服务器...
  • nginx+keepalived:局域网内网和公网外网 搭建nginx HA 双机热备 高可用 nginx 把 POST请求数据 写入到 日志文件中 nginx 自动解压gzip压缩数据的两种方式:nginx自动解压、后台java程序解压 nginx安装、nginx...
  • 跨域请求nginx图片

    2021-05-18 19:49:42
    为了能在HTML中访问阿里云服务器的静态图片资源,用nginx代理来实现 server { listen xx; server_name xx.xx.xx.xx; location / { root imagePath; } } 但是在对其进行base64转码时,遇到了跨域问题,...
  • nginx静态服务器

    2021-07-14 21:33:56
    一、nginx作为静态WEB服务 1、概念 nginx作为静态资源Web服务器部署配置, 传输非常的高效, 常常用于静态资源处理, 请求, 动静分离 2、静态资源类型 类型 种类 浏览器端 渲染 HTML、CSS、JS 图片 JPEG、GIF、PNG ...
  • 简介 这里静态资源就以之前的一个项目文章地址为例,源码 Github,项目本身很简单,只是...下面以 Windows 为例,采用 Nginx 两个步骤,来实现针对 Vue 项目的静态资源服务器及跨域配置。 Notes: 补充一...
  • 在server中配置 add_header Access-Control-Allow-Origin *; add_header Access-Control-Allow-Headers X-Requested-With; add_header Access-Control-Allow-Methods GET,POST,...Apache支持跨域 ServerNa...
  • Nginx 静态资源

    2021-06-02 14:33:51
    Nginx 作为静态资源 Web 服务器部署配置, 传输⾮常的⾼效, 常常⽤于静态资源处理, 请求, 动静分离 ⾮服务器动态运⾏⽣成的⽂件属于静态资源 类型 种类 浏览器端渲染 HTML、CSS、JS 图片 JPEG、GIF、PNG ...
  • 解决vue本地跨域问题-简单nginx配置跨域 1、config/index.js下添加proxyTable dev: { // Paths assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable: { // "/api/*":{ // //代理的目标 // ...
  • Nginx反向代理及跨域

    2020-08-02 00:41:55
    nginx反向代理配置2. 什么是反向代理服务器2.1 外网客户机2.2 nginx反向代理服务2.3 内网web服务3. 反向代理服务器的好处4. nginx如何配置反向代理4.1 Unix socket后端服务配置4.2 ip端口后端服务配置5. proxy_pass...
  • 3、Nginx静态资源

    2020-07-27 18:16:11
    3 Nginx静态资源 静态资源 不需要服务器动态运行生成的文件为静态资源,如HTML、css、js、图片、视频、文件等 静态资源配置语法 1)文件读取的高效:sendfile开启。直接在内核态拷贝,减少拷贝和切换。 2)提高...
  • vue+nginx设置跨域

    千次阅读 2019-08-26 10:38:28
    Vue项目部署到nginx上的跨域设置 这还没完,现在我们要将项目部署到nginx上,此时原来可以访问的接口又访问不到了,所以这个时候还要对nginx进行设置。 下载安装自行百度~~~ 下载完成后目录: 进入cong文件,...
  • 参考文章: ...前端开发者必备的nginx知识 https://blog.csdn.net/William526/article/details/101621007 https://www.cnblogs.com/lingyao/p/11201517.html Nginx 安装配置–菜鸟教程 Nginx 中文文档
  • 本章节主要讲述nginx的如何配置跨域、缓存、压缩; 步骤: 1.跨域 场景:首先我们举例看看什么叫做跨域: 当我们加载static.xxxx.com的页面之后,在js中调用www.xxxx.com接口,这个时候就叫做跨域;因为请求的...
  • nginx 跨域问题

    2020-08-06 14:56:45
    # 启动 nginx systemctl start nginx # 检查监听端口 ss -ntal |grep 80 继续在 前端服务器上启动 nginx 服务 systemctl restart nginx 4 解决 AJAX 跨域请求 解决跨域的方法很多,这里仅介绍 Nginx 方式。...
  • 图片(jpeg、gif、png) 视频(flv、mpeg) 文件(txt...) 静态资源服务场景--CDN 文件读取语法配置 sendfile on|off; (http、server、location、if in location) 引读:--with-file-aio 异步文件读取 tcp_nopus.....
  • Ajax跨域Nginx反向代理 跨域是浏览器对其请求的过滤,保证安全 一、一种流行的跨域方式 CORS CORS是后端配置,在前端请求时,后端的响应请求写入一些运行跨域字段来告诉浏览器不要拦截响应运行跨域 优点: 允许...
  • nginx静态资源web服务

    2019-01-04 14:55:00
    图片:jpeg,gif,png 视频:flv ,mpeg 文件:txt,等任意下载文件 静态资源服务场景:CDN 文件读取高效: sendfile on|off 在sendfile开启的情况下,提高网络包的传输效率,可以打开下面 tcp_nopush on 在keepalive...
  • nginx配置成系统服务,静态资源相关指令,压缩功能,静态资源缓存,跨域,防盗链
  • nginx静态资源(2)

    2019-02-13 13:38:55
    图片 JPEG GIF PNG 视频 FLV MPEG 文件 TXT 等任意下载文件 注: MPEG是一种编码标准,而mp4是文件格式,符合MPEG,AVI也同理。 2.静态资源服务器场景–CDN CDN – &gt;这项技术 : 内容分发网络 3.压缩...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 3,663
精华内容 1,465
关键字:

nginx静态图片跨域