从 ajax 中的 HttpResponse() 加载视图时出现混合内容错误
Mixed content error in loading a view from an HttpResponse() in ajax
首先,我确定代码中没有尾随http
,我的nginx服务器没有明显的配置错误。我觉得这个问题很奇怪:
我得到了一个带有不同选项卡的主视图,每个选项卡都由 CBV 提供。例如,我用这个HTML代码调用company
选项卡的内容:
<li class="">
<a href="{% url "staffpanel:companies:company_detail" company.pk %}" id='companyTab' data-toggle="tab">{% trans "Company" %}</a>
</li>
它自然地调用了这个加载在选项卡内容中的视图,<div id="tabContent"></div>
以下代码:
class CompanyDetail(StaffPanelMixin, DetailView):
model = Company
template_name = "staffpanel/companies/_company.html"
和以下 js:
$('a[data-toggle="tab"]').on('show.bs.tab', function (event){
var tab = $(event.target).attr("id");
var action = $(event.target).attr("href");
$.get(action, null, function( data ) {
$("#tabContent").html( data );
});
return false;
});
在每个选项卡上,我可以将表单打开为模态块。此窗体调用更新 CBV,允许用户编辑选项卡中显示的对象。更新视图验证如下所示:
class CompanyUpdate(StaffPanelMixin, UpdateView):
template_name = "staffpanel/companies/_company_form.html"
model = Company
form_class = CompanyUpdateForm
def get_success_url(self):
return reverse("staffpanel:companies:company_detail",
args=(self.object.pk,))
目前,一切都很好。如果表单无效,则数据将以模态块中包含的表单正确返回,并按预期显示带有消息错误的表单。多亏了这段代码:
$(document).on('submit', '#companyForm', function () {
var form = $('#companyForm');
var actionUrl = form.prop('action');
var modal = $('#genericModal');
ajaxform(new FormData(form[0]), modal, actionUrl);
return false;
});
function ajaxform(formData, modal, actionUrl) {
$.ajax({
url: actionUrl,
type: 'POST',
data: formData,
processData: false,
contentType: false,
success: function (data) {
if (($(".has-error", data).length != 0) || ($(".alert", data).length !=0 )) {
$(".modal-content").html( data )
}
else {
modal.modal('hide');
$("#tabContent").html( data );
}
}
});
}
问题伴随着成功消息。虽然它在无效形式的情况下工作正常,但它无法加载成功的 url 并引发混合内容错误并查找具有错误协议的视图。我正在使用SSL,它使用HTTP而不是HTTPS调用详细信息视图。
我必须精确地确定更新视图在更新数据时正确完成其工作。这确实是返回详细信息CBV的问题。
这是一个错误吗?我在js上做错了吗(肯定(?为什么 js 可以在一个案例(加载选项卡(而不是更新后加载详细的 CBV(因为这与调用的视图严格相同(?顺便说一下,为什么网址协议会改变?
注意:我试图在django设置中设置SECURE_PROXY_SSL_HEADER和SECURE_SSL_REDIRECT,但没有成功。(我陷入了无限重定向的循环中(。
看来我无法直接加载页面而不会遇到这种痛苦的混合内容问题(由于 HttpResponse(( 而更改 HTTP 中的 HTTPS(。
所以我的解决方案是返回一个包含success_url
的 JsonResponse,然后我能够从js
选项卡加载。
我在更新视图中覆盖了form_valid,如下所示:
def form_valid(self, form);
super().form_valid(form)
return JsonResponse({'succes_url': self.get_success_url()})
在我的 ajax 调用中,我不得不替换这一行:
$("#tabContent").html( data );
有了这个:
$("#tabContent").load( data['success_url'] );
仅此而已。
希望这有帮助!
- Node.js v6.2.0类扩展不是函数错误
- Jquery菜单操作不稳定,定位不正确,存在一般错误
- document.open/document.write没有正确地清除chrome中的文档——这是chrome的错误吗
- Catching'阻止加载混合活动内容'CORS错误
- 防止在 HTTPS 父级中嵌入 HTTP 帧时出现混合内容错误
- 通过https使用Nivo灯箱时出现混合内容错误
- 从 ajax 中的 HttpResponse() 加载视图时出现混合内容错误
- “混合空格和制表符错误”和“未捕获的语法错误:意外的标记<(第 1 行)”
- 如何在 Firefox 附加组件上允许跨域内容脚本而不触发混合内容阻止错误
- Nivo滑块jQuery导致IE 8中出现混合内容错误
- Visual Studio多设备混合无法获取包信息错误
- 多设备混合应用程序的Web服务错误
- 调用replaceWith会给出“;而不是函数“;错误(将文本节点替换为文本和html的混合)
- 设置混合架构类型错误
- 为什么我的https://请求取消并更改为http://,导致混合请求错误
- 混合代码错误
- 识别可能的错误向量,javascript警报后,混合网站上的网页表单似乎禁用了javascript
- 混合应用程序在上传图像时关闭而不会在logcat中出现任何错误
- 混合内容页:请求一个不安全的样式表错误
- 我怎样才能绕过这个“混合内容”被屏蔽的问题呢?博客错误