2020年3月

Ajax 跨域请求 Cookie 无法携带/保存的解决办法

服务器端设置

Nginx 端设置:

http://192.168.3.4 是允许跨域的域名,80和443 可以不用加端口号,除此之外的端口号要加
add_header 'Access-Control-Allow-Origin' 'http://192.168.3.4';
add_header 'Access-Control-Allow-Credentials' 'true';

PHP 端设置:

解释同上
header("Access-Control-Allow-Origin: http://192.168.3.4");
header("Access-Control-Allow-Credentials: true");

前端设置

jQuery Ajax 请求:

$.ajax({
    url: 'http://nas/api/v2/sync/maindata',
    xhrFields: {
        // 允许携带证书
        withCredentials: true
    },
    dataType: 'json',
    success: function (res) {
        console.log("请求结果:"+res);
    }
});

Nginx如何配置跨域(多个域名)

设需要允许来源为 localhost*.example.com 下所有二级域名的访问,在 nginx 中只需要类似这样配置即可:

location / {
        set $match "";
        # 支持http及https
        if ($http_origin ~* 'https?://(localhost|.*\.example\.com)') {
        set $match "true";
        }
        
        if ($match = "true") {
            add_header Access-Control-Allow-Origin "$http_origin";
            add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
            add_header Access-Control-Allow-Methods GET,POST,OPTIONS,DELETE;
            add_header Access-Control-Allow-Credentials true;
        }
        # 处理OPTIONS请求
        if ($request_method = 'OPTIONS') {
            return 204;
        }
    }
————————————————

原文链接:https://blog.csdn.net/moxiaomomo/article/details/82970004

MDUI 实现右击菜单弹出菜单栏

更新记录

03/17 00:12:解决滚动页面后右击菜单栏出现在顶部。解决办法将 e.clientY 换成 e.pageY

在线预览:https://nowtime.cc/mdui/contextmenu.html

核心 JavaScript 代码:

    var $$ = mdui.JQ;
    //监听鼠标右击事件 / 移动端长按事件
    $$(document).on('contextmenu', function (e) {
        // console.log(e);

        //0:移动端长按(iOS 测试未通过)
        //2:电脑端右键
        if(e.button === 2 || e.button === 0) {
            e.preventDefault();//阻止冒泡,阻止默认的浏览器菜单

            //(修改了这里)鼠标点击位置,相对于页面
            var _x = e.pageX,
                _y = e.pageY;

            let $div = $$("<div></div>").css({
                position: 'absolute',
                top: _y+'px',
                left: _x+'px',
            });
            $$('body').append($div);//创建临时DOM

            // anchorSelector 表示触发菜单的元素的 CSS 选择器或 DOM 元素
            // menuSelector 表示菜单的 CSS 选择器或 DOM 元素
            // options 表示组件的配置参数,见下面的参数列表
            // 完整文档列表:https://doc.nowtime.cc/mdui/menu.html
            var inst = new mdui.Menu($div, '#menu');
            inst.open();//打开菜单栏
            $div.remove();//销毁创建的临时DOM
        }
    });

完整 HTML代码

- 阅读剩余部分 -