2020-03-23-202003学习记录

写在前面的话

以下内容为本人在3月里开发和学习中遇到的问题及相关解决方案

跨域

后端配置解决跨域

Cross-Origin Resource Sharing（CORS）跨来源资源共享是一份浏览器技术的规范，提供了 Web 服务从不同域传来沙盒脚本的方法，以避开浏览器的同源策略，是 JSONP 模式的现代版。与 JSONP 不同，CORS 除了 GET 要求方法以外也支持其他的 HTTP 要求。
用 CORS 可以让网页设计师用一般的 XMLHttpRequest，这种方式的错误处理比 JSONP 要来的好。另一方面，JSONP 可以在不支持 CORS 的老旧浏览器上运作。现代的浏览器都支持 CORS。

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;

@Configuration
public class CorsConfig {
    private CorsConfiguration buildConfig() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        corsConfiguration.addAllowedOrigin("*"); // 1
        corsConfiguration.addAllowedHeader("*"); // 2
        corsConfiguration.addAllowedMethod("*"); // 3
        return corsConfiguration;
    }

    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", buildConfig()); // 4
        return new CorsFilter(source);
    }

}

ajax跨域

参考链接

JS相关

前端JS中使用sessionStorage存值

var userEntity = { name: 'ikkyu', num: 1001 }; // 存储值：将对象转换为Json字符串 
sessionStorage.setItem('user', JSON.stringify(userEntity)); // 取值时：把获取到的Json字符串转换回对象 
var userJsonStr = sessionStorage.getItem('user'); 
userEntity = JSON.parse(userJsonStr);
console.log(userEntity.name); 

动态修改iframe中的src

	document.getElementById("myframe").src="https://www.baidu.com/";

js获取当前url的参数

通过字符串截取的方式获取参数

function GetRequest(urlStr) {
    var theRequest = new Object();
    if (typeof urlStr == "undefined") {
        var url = decodeURI(location.search); //获取"?"后的字符串
    } else {
        var url = "?" + urlStr.split("?")[1];
    }
    if (url.indexOf("?") != -1) {
        var str = url.substr(1);
        strs = str.split("&");
        for (var i = 0; i < strs.length; i++) {
            theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
        }
    }
    return theRequest;
}

使用Jquery.i18n读取properties文件

function loadProperties(){
	jQuery.i18n.properties({//加载资浏览器语言对应的资源文件
		name:'strings', //资源文件名称
		path:'resources/i18n/', //资源文件路径
		mode:'map', //用Map的方式使用资源文件中的值
		callback: function() {//加载成功后设置显示内容
			//用户名
			$('#label_username').html($.i18n.prop('string_username'));
		    //密码
			$('#label_password').html($.i18n.prop('string_password'));
		    //登录
			$('#button_login').val($.i18n.prop('string_login'));
		}
	});
}

string_username=Username
string_password=Password

IIS服务器不支持properties的解决方案

将properties文件类型映射成其他支持的类型
方式一：直接修改web.config

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <appSettings file="C:\01web\board" />
    <system.webServer>
        <mimeMap fileExtension=".properties" mimeType="application/x-javascript"/>
    </system.webServer>
</configuration>

方式二：
在IIS服务器的控制界面，找到”MIME类型“，添加".properties"映射为"application/x-javascript"